<script lang="ts" setup>
import { complaintDetail,img } from "@/apis/my"
import { onLoad, onPullDownRefresh } from '@dcloudio/uni-app'
import constant from "@/utils/constant"
import { computed, ref } from "vue";
import { useUserStore} from '@/store/user'
import { count } from "console";
const userStore = useUserStore()
const loading = ref(true)
const imgurl = ref<any>("")
const complaintContent = ref<any>({})
	onLoad((e)=>{
		getlist(e)
	})
	function getlist(e){
		complaintDetail(e?.id).then((res)=>{
			complaintContent.value = res
			if(res.img){
				getImg(res.img)
			}
			
			loading.value = false
		})
	}
//  请求图片	
	function getImg(val){
		uni.request({
			method: "GET",
			url: constant.imgUrl + "/" + val,
			header: { 
				Authorization: userStore.token,
			},
			data:{
				type: "base64"
			},
			success: (res: any) => {
				// imgurl.value = url
				imgurl.value = 'data:image/png;base64,' + res.data
			}

	})
}
const getImgUrl = computed(()=>{
	console.log(imgurl.value);
		return imgurl.value
	})
</script>

<template>
	<view>
		<view class="display">
			<view class="displayColumn" style="margin-right:40rpx;">
				<text>关联任务</text>
				<text>运单开始时间</text>
				<!-- <text>收入/支出</text> -->
				<text>运单结束时间</text>
				<text>申诉时间</text>
				<text>申诉原因</text>
				<text style="line-height: 120rpx;">申诉图片</text>
				<text>处理状态</text>
				<!-- <text>图片</text> -->
				<view v-show="complaintContent.state!==1">
					<text>处理时间</text>
					<text>处理人</text>
					<text>处理意见</text>
				</view>
				<!-- <text>处理人</text> -->
				<!-- <text>处理意见</text> -->
				<!-- <text>处理时间</text> -->
			</view>
			<view class="displayColumn" v-if="!loading">
				<view class="">{{complaintContent.taskName}}</view>
				<view class="">{{complaintContent.startTime}}</view>
				<view class="">{{complaintContent.endTime}}</view>
				<view class="">{{complaintContent.createTime}}</view>
				<view class="">{{complaintContent.info}}</view>
				<image :src="getImgUrl" mode="" style="width: 80rpx; height: 80rpx; margin: 20rpx 0;"/>
				<view class="">{{complaintContent.state== 1 ? '未处理' : '已处理'}}</view>
				<view v-show="complaintContent.state!==1">
					<view class="">7</view>
					<view class="">8</view>
					<view class="">9</view>
				</view>
			</view>
		</view>
		<!-- <view style="width: 300rpx; margin: 20rpx auto;" v-show="userStore.user.id == billContent.paypalId">
			<u-button text="微信支付" type="primary" :plain="true" color="#2aca22"/>
		</view> -->
	</view>
</template>

<style>
	page{
		background-color: #f0f0f0;
	}
.display{
	display: flex;
	flex-direction: row;
	/* background-color: #fff; */
	margin: 20rpx;
}
.displayColumn{
	/* width: 250rpx; */
	font-size: 31rpx;
	display: flex;
	flex-direction: column;
	
}
text{
	text-align: right;
}
</style>
